<template>
  <div>

    <el-dialog title="请选择" :visible.sync="dialogTableVisible">
      <el-table :data="tableData.list" style="width: 100%">
        <el-table-column prop="no" align="center" label="采购单号" width="180">
        </el-table-column>
        <el-table-column prop="name" align="center"  label="创建时间" width="180">
          <template slot-scope="scope">
            {{scope.row.ctime | formatDate}}
          </template>
        </el-table-column>
        <el-table-column prop="type" label="类型">
        </el-table-column>
        <el-table-column prop="type" label="供应商/采购员">
          <template slot-scope="scope">
            {{scope.row.purchaser_name}}
            {{scope.row.supplier_name}}
          </template>
        </el-table-column>
        <el-table-column prop="remarks" label="备注">
        </el-table-column>
        <el-table-column prop="type" label="操作">
          <template slot-scope="scope">
            <el-link @click="selectfunc(scope.row.id)" :underline="false" type="primary">选择</el-link>
          </template>
        </el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogTableVisible = false">取 消</el-button>
      </div>
    </el-dialog>


    <el-main>
      <el-tabs value="first">
        <el-tab-pane label="基本信息" name="first">
          <div style="display: flex;">
           <div style="flex: 1;">仓库：{{headContent.warehouse_name}}</div>
            <div style="flex: 1;">采购类型：{{headContent.type}}</div>
            <div style="flex: 1;">采购员/供应商：{{headContent.purchaser_name}}{{headContent.supplier_name}}</div>
            <div style="flex: 1;">源采购单号：{{headContent.type}}</div>
          </div>
        </el-tab-pane>
      </el-tabs>
      <!-- <div style="position: absolute;z-index: 9;right: 50px;top: 40px;">
        <el-button @click="selectorder()"> 请选择采购单 </el-button>
      </div> -->
      <el-tabs style="margin-top: 10px;" value="first">
        <el-tab-pane label="采购退回单清单" name="first">
          <el-table :data="itemList.list" style="width: 100%">
            <el-table-column type="index" align="center" label="序号" width="100">
            </el-table-column>
            <el-table-column prop="no" align="center" label="商品图片" width="180">
              <template slot-scope="scope">
                <img :src="scope.row.image_path" style="width: 40px;" alt="">
              </template>
            </el-table-column>
            <el-table-column prop="product_name" align="center"  label="商品名称" width="180">
            </el-table-column>
            <el-table-column prop="unit" label="单位">
            </el-table-column>
            <el-table-column prop="type" label="单价">
              <template slot-scope="scope">
                <el-input v-model="scope.row.signfor_price" type="number" placeholder="请输入内容"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="type" label="数量">
              <template slot-scope="scope">
                <el-input v-model="scope.row.signfor_qty" type="number" placeholder="请输入内容"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="type" label="总价">
              <template slot-scope="scope">
                <div>{{scope.row.signfor_price * scope.row.signfor_qty}}</div>
              </template>
            </el-table-column>
            <el-table-column prop="remarks" label="备注">
              <template slot-scope="scope">
                <el-input v-model="scope.row.remarks" type="number" placeholder="请输入内容"></el-input>
              </template>
            </el-table-column>
            <!-- <el-table-column prop="type" label="操作">
              <template slot-scope="scope">
                <el-link :underline="false" @click="delfunc(scope.$index)" type="primary">删除</el-link>
              </template>
            </el-table-column> -->
          </el-table>
        </el-tab-pane>
      </el-tabs>
      <div style="margin-top: 20px;">
      <el-button @click="savefunc()" type="primary">保 存</el-button>
      <el-button @click="cancelfunc()">取 消</el-button>
      </div>
    </el-main>
  </div>
</template>

<script>
  import {
    getList,getitemlist
  } from '@/api/purchase/purchasenote.js'
  import {purchasebackedit,purchasebackList} from '@/api/purchase/purchase_back.js'
  export default {
    data() {
      return {
        dialogTableVisible: false,
        tableData: [],
        itemList:[],
        headContent:"",
      }
    },
    created() {

      this.selectfunc(this.$route.params.id)

    }
    ,methods: {
      savefunc(){

        console.log(this.itemList);
        if( this.itemList.length == 0 || this.itemList.list.length == 0){
          this.$message({
            message:"请选择数据",
            type:"error"
          })
          return
        }else{
          this.itemList.list.forEach(async(item)=>{
            console.log(item,2222222222222222222222);
            // let timestamp1 = Date.parse( new Date());


            // "signforPrice": 100,
            //     "signforQty": 2.5,
            //     "signforSubtotal": 250,
            //     "status": 3,   //  1待确认  2待发货  3已发货  4已完成
            //     "shippingCost": 50   //运输费


            let data = {
              id:item.id,
              signforPrice:item.signfor_price*100,
              signforQty:item.signfor_qty,
              signforSubtotal:item.signfor_price * item.signfor_qty,
              status:1,

              // productName:item.product_name,
              // productId:item.product_id,
              // qty:item.signfor_qty,
              // unit:item.unit,
              // price:parseInt(item.signfor_price *100),
              // subtotal:parseInt(item.signfor_price*100*item.signfor_qty),
              // remarks:item.remarks,
              // ctime:timestamp1/1000,
              // userId:11, //暂时写死
            }
            console.log(data);
            let res = await purchasebackedit(data)
            console.log(res);
          })
        }
        this.$message({
          message:"保存成功",
          type:"success"
        })
        this.$router.push("/purchase/purchasingback")
      }
      ,cancelfunc(){
        this.$router.push("/purchase/purchasingback")
      }
      ,async selectorder() {
        let data = {
          status: 3
        }
        let res = await getList(10, 1, data)
        this.tableData = res
        console.log(res);
        this.dialogTableVisible = true
      },
      async selectfunc(val){
        let data = {
          id: val
        }
        let res = await getList(10, 1, data)
        this.headContent = res.list[0]
        console.log('参考用',res);
        let parmas={
          size:1000,
          current:1,
        }

        let itemres = await purchasebackList(parmas,{order_id:val})
        console.log('itemres',itemres);
        itemres.list.forEach((item)=>{
          item.signfor_price = item.signfor_price/100
          item.signfor_subtotal= item.signfor_subtotal/100
        })
        this.itemList = itemres
        // console.log(this.itemList);
      },
      delfunc(val){
          this.itemList.list.splice(val,1)
      }
    },
    filters:{
      formatDate(date) {
        var date = new Date(date*1000);
        var YY = date.getFullYear() + '-';
        var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
        var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
        var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
        var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
        var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
        return YY + MM + DD +" "+hh + mm + ss;
      }
    }
  }
</script>

<style>
</style>
